<template>
  <div>
    <el-table :data="tableData"  v-loading="state.loading" size="medium">
      <el-table-column label="编号" type="index" width="60" align="center"></el-table-column>
      <el-table-column label="定时策略"  prop="expression" width="160" align="center"></el-table-column>
      <el-table-column label="备注"   prop="remark" align="center"></el-table-column>
    </el-table>
    <!-- 分页 -->
    <div class="page-box">
      <el-pagination background
        layout="total, prev, pager, next, sizes, jumper" 
        :current-page.sync="query.pageNo" 
        :page-size.sync="query.pageSize" 
        :total="dataCount" 
        :page-sizes="[1, 5, 10, 20, 30, 100]" 
        @current-change="f5()" 
        @size-change="f5()">
      </el-pagination>
    </div>
  </div>
</template>

<script>
export default {
  data(){
    return{
      tableData:[],
      dataCount:0,
      query:{
        pageNo:1,
        pageSize:5
      },
      state:{
        loading:false
      }
    }
  },
  methods:{
    f5(){
      this.state.loading=true
      let params=this.query
      this.request('/api/schedule/cronList',params).then(res=>{
        if(!res){return}
        console.log(res);
        this.tableData=res.data.records
        this.dataCount=res.data.total
        this.state.loading=false
      })

    }
  },
  mounted(){
    this.f5()
  }
}
</script>

<style>

</style>